<!--
*  功能描述：客户录入反填
 -->

<template>
  <div>
    <!-- 基本信息 -->
    <div class="jbxx">
      <el-descriptions :model="CustomerData" title="基本信息" :column="2" border>
        <el-descriptions-item label="编号：">
          <el-input v-model="CustomerData.CustId" placeholder="请输入内容"></el-input>
        </el-descriptions-item>x``
        <el-descriptions-item label="客户简称：">
          <el-input v-model="CustomerData.CustAbbreviation" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="客户名称：">
          <el-input v-model="CustomerData.CustName" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="公司地址：">
          <el-input v-model="CustomerData.CustAddress" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="邮政编码：">
          <el-input v-model="CustomerData.CustEmail" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="联系人：">
          <el-input v-model="CustomerData.CustPhones" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="公司电话：">
          <el-input v-model="CustomerData.CustPhone" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
        <el-descriptions-item label="传真号：">
          <el-input v-model="CustomerData.CustFaxNumber" placeholder="请输入内容"></el-input>
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <!-- 甲方负责人显示 -->
    <div class="jffzr">
      <el-descriptions class="margin-top" title="甲方负责人">
      </el-descriptions>
      <template>
        <el-table :data="PersonData" border style="width: 100%">
          <el-table-column prop="PersonId" label="序号"> </el-table-column>
          <el-table-column prop="PersonNmae" label="姓名"> </el-table-column>
          <el-table-column prop="PersonZhiWu" label="职务"> </el-table-column>
          <el-table-column prop="PersonBuMen" label="部门"> </el-table-column>
          <el-table-column prop="PersonPhone" label="电话"> </el-table-column>
          <el-table-column prop="PersonEmail" label="Email"> </el-table-column>
          <el-table-column prop="PersonBeiZhu" label="备注"> </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button size="mini" @click="editPersons(scope.row.PersonId)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
    </div>
    <!-- 扩展信息 -->
    <div class="kzxx">
      <el-descriptions :model="ExtendedData" title="扩展信息" :column="3" border>
        <!-- 第一行 -->
        <el-descriptions-item label="编号">
          {{ ExtendedData.EdId}}
        </el-descriptions-item>
        <el-descriptions-item label="客户英文名：">
          {{ExtendedData.EdName}}
        </el-descriptions-item>
        <el-descriptions-item label="所在国家：">
          <el-select v-model="ExtendedData.EdCountryId1" placeholder="请选择国家" @change="showAddress2" disabled>
            <el-option v-for="item in country" :key="item.AddressId" :label="item.AddressName" :value="item.AddressId">
            </el-option>
          </el-select>
        </el-descriptions-item>
        <!-- 第二行 -->

        <el-descriptions-item label="Email：">
          {{ExtendedData.EdEmail}}
        </el-descriptions-item>
        <!-- 第四行 -->

        <el-descriptions-item label="关系部门：">
          {{ExtendedData.EdBuMen}}
        </el-descriptions-item>

        <el-descriptions-item label="开户银行名称：">
          {{ExtendedData.EdBankName}}
        </el-descriptions-item>
        <el-descriptions-item label="企业代码：">
          {{ExtendedData.EdEnterprise}}
        </el-descriptions-item>
        <!-- 第五行 -->
        <el-descriptions-item label="开户银行账号：">
          {{ExtendedData.EdBankAccount}}
        </el-descriptions-item>
        <el-descriptions-item label="备注：">
          {{ExtendedData.EdBeiZhu}}
        </el-descriptions-item>
      </el-descriptions>

    </div>
    <!-- 附件 -->
    <div class="fj">
      <el-descriptions class="margin-top" title="附件">
      </el-descriptions>
      <template>
        <el-table :data="AccessoryData" border style="width: 100%">
          <el-table-column prop="AcsoryIdNmae" label="文件名"> </el-table-column>
          <el-table-column prop="AcsoryIdTime" label="上传时间"> </el-table-column>
          <el-table-column prop="AcsoryIdSize" label="文件大小"> </el-table-column>
          <el-table-column prop="AcsoryIdType" label="文件类型"> </el-table-column>
          <el-table-column prop="AcsoryIdUser" label="用户"> </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button size="mini" @click="editAccessorys(scope.row)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
    </div>
    <!-- 满意度调查 -->
    <div class="myddc">
      <el-descriptions class="margin-top" title="满意度调查" :size="size">
      </el-descriptions>
      <template>
        <el-table :data="SatisfactionData" border style="width: 100%">
          <el-table-column prop="SaId" label="序号"> </el-table-column>
          <el-table-column prop="SaNeiRong" label="调查内容"> </el-table-column>
          <el-table-column prop="SaManYi" label="满意度"> </el-table-column>
          <el-table-column prop="SaTime" label="调查时间"> </el-table-column>
          <el-table-column prop="SaMethodId" label="调查方式"> </el-table-column>
          <el-table-column prop="SaBeiZhu" label="备注"> </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button size="mini" @click="editSatisfactions(scope.row)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>

      </template>
    </div>
    <!-- 查看甲方负责人 -->
    <el-dialog title="查看甲方负责人" :visible.sync="dialogVisibleEdit">
      <el-form :model="AddPerson1">
        <!-- 第一行 -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="序号：" :label-width="formLabelWidth">
              {{ AddPerson1.PersonId}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="住宅电话：" :label-width="formLabelWidth">
              {{AddPerson1.PersonShangWuD}}
            </el-form-item>
          </el-col>

        </el-row>
        <!-- 第二行 -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="职务：" :label-width="formLabelWidth">
              {{AddPerson1.PersonZhiWu}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电话：" :label-width="formLabelWidth">
              {{AddPerson1.PersonPhone}}
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第三行 -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="部门：" :label-width="formLabelWidth">
              {{AddPerson1.PersonBuMen}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="商务传真：" :label-width="formLabelWidth">
              {{AddPerson1.PersonShangWuC}}
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第四行 -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="住宅传真：" :label-width="formLabelWidth">
              {{AddPerson1.PersonZhuZhaiC}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="Email：" :label-width="formLabelWidth">
              {{AddPerson1.PersonEmail}}
            </el-form-item>
          </el-col>
        </el-row>
        <!-- 第五行 -->
        <el-row>
          <el-col :span="12">
            <el-form-item label="备注：" :label-width="formLabelWidth">
              {{AddPerson1.PersonBeiZhu}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="姓名：" :label-width="formLabelWidth">
              {{AddPerson1.PersonNmae}}
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleEdit = false">取 消</el-button>

      </div>
    </el-dialog>
    <!-- 查看附件 -->
    <el-dialog title="查看附件" :visible.sync="dialogVisibless2">
      <el-form :model="upAccessory">
        <el-form-item label="文件名：" :label-width="formLabelWidth">
          {{upAccessory.AcsoryIdNmae}}
        </el-form-item>
        <el-form-item label="上传时间：" :label-width="formLabelWidth">
          {{upAccessory.AcsoryIdTime}}
        </el-form-item>
        <el-form-item label="文件大小：" :label-width="formLabelWidth">
          {{upAccessory.AcsoryIdSize}}
        </el-form-item>
        <el-form-item label="文件类型：" :label-width="formLabelWidth">
          {{upAccessory.AcsoryIdType}}
        </el-form-item>
        <el-form-item label="用户：" :label-width="formLabelWidth">
          {{upAccessory.AcsoryIdUser}}
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibless2 = false">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 查看客户满意度 -->
    <el-dialog title="查看客户满意度" :visible.sync="dialogVisibles1">
      <el-form :model="UpSatisfaction">
        <el-form-item label="序号：" :label-width="formLabelWidth">
          <el-input v-model="UpSatisfaction.SaId" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="调查内容：" :label-width="formLabelWidth">
          <el-input v-model="UpSatisfaction.SaNeiRong" type="textarea" disabled></el-input>
        </el-form-item>
        <el-form-item label="客户基本信息编号" :label-width="formLabelWidth">
          <el-input v-model="UpSatisfaction.CustomerId" disabled></el-input>
        </el-form-item>

        <el-form-item label="满意度：" :label-width="formLabelWidth">
          <el-select v-model="UpSatisfaction.SaManYi" placeholder="请选择调查方式" disabled>
            <el-option label="满意" value="满意"></el-option>
            <el-option label="非常满意" value="非常满意"></el-option>
            <el-option label="不满意" value="不满意"></el-option>
            <el-option label="非常不满意" value="非常不满意"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="调查方式：" :label-width="formLabelWidth">
          <el-select v-model="UpSatisfaction.SaMethodId" placeholder="请选择城市" disabled>
            <el-option label="问卷调查" value="问卷调查"></el-option>
            <el-option label="统计调查" value="统计调查"></el-option>
            <el-option label="询问调查" value="询问调查"></el-option>
            <el-option label="电话调查" value="电话调查"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注：" :label-width="formLabelWidth">
          <el-input v-model="UpSatisfaction.SaBeiZhu" type="textarea" disabled></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibles1 = false">取 消</el-button>
      </div>
    </el-dialog>
    <el-button @click="fh">返回</el-button>
    <el-button type="info" @click="loadExcel">导出</el-button>
  </div>
</template>
<script>

export default {
  data () {
    return {
      formLabelWidth: 120,
      //客户管理
      CustomerData: [],
      //甲方负责人显示
      PersonData: [],
      //扩展信息反填
      ExtendedData: [],

      //查看甲方负责人
      AddPerson1: {
        PersonId: '',
        PersonNmae: '',
        PersonZhiWu: '',
        PersonPhone: '',
        PersonBuMen: '',
        PersonShangWuD: '',
        PersonShangWuC: '',
        PersonZhuZhaiC: '',
        PersonEmail: '',
        PersonBeiZhu: '',
      },
      dialogVisible: false,
      dialogVisibleEdit: false,
      dialogVisibles: false,
      dialogVisibless: false,
      dialogVisibles1: false,
      dialogVisibless1: false,
      dialogVisibless2: false,
      //用于显示满意度调查
      SatisfactionData: [],
      //用于显示附件
      AccessoryData: [],

      //查看客户满意度
      UpSatisfaction: {
        SsaId: '',
        SaNeiRong: '',
        SaTime: '',
        SaManYi: '',
        SaMethodId: '',
        SaBeiZhu: '',
        CustomerId: ''
      },
      //查看附件
      upAccessory: {
        AcsoryId: '',
        AcsoryIdNmae: '',
        AcsoryIdTime: '',
        AcsoryIdSize: '',
        AcsoryIdType: '',
        AcsoryIdUser: '',
        CustomerId: '',
      },

      country: [],//所在国家数组
      province: [],//省
      city: [], //市
      ClientType: [],//客户类型
      industry: [],//所属行业
    }
  },
  methods: {
    editCustInfoEdit () {//反填客户信息
      var id = this.$route.params.id
      this.$http({
        url: 'CustInfoList/GetCustomerFT',
        method: 'get',
        params: {
          id: id
        }
      })
        .then(res => {
          this.CustomerData = res.data
          console.log(this.CustomerData)
        })
    },
    showPersons () {//显示甲方负责人
      var id = this.$route.params.id
      this.$http({
        url: 'CustInfo/GetPerson',
        method: 'get',
        params: {
          custid: id
        }
      })
        .then(res => {
          this.PersonData = res.data
        })
    },
    EditExtended () {//反填扩展信息
      var id = this.$route.params.id
      this.$http({
        url: 'CustInfoList/GetSatisfactionFT',
        method: 'get',
        params: {
          id: id
        }
      })
        .then(res => {
          this.ExtendedData = res.data
        })
    },
    showAddress1 () {//国家
      this.$http({
        url: 'CustInfo/GetAddress1',
        method: 'get',
      })
        .then(res => {
          this.country = res.data
          this.showAddress2(res.data.PersonId)
        })

    },

    showTypes () {//客户类型
      this.$http({
        url: 'CustInfo/GetTypes',
        method: 'get',
      })
        .then(res => {
          this.ClientType = res.data
        })
    },
    showIndustry () {//所属行业
      this.$http({
        url: 'CustInfo/GetIndustry',
        method: 'get',
      })
        .then(res => {
          this.industry = res.data
        })
    },
    showAccessorys () {//显示附件
      var id = this.$route.params.id
      this.$http({
        url: 'CustInfo/GetAccessory',
        method: 'get',
        params: {
          custid: id
        }
      })
        .then(res => {
          this.AccessoryData = res.data
        })
    },
    showSatisfactions () {//显示客户满意度
      var id = this.$route.params.id
      this.$http({
        url: 'CustInfo/GetSatisfaction',
        method: 'get',
        params: {
          custid: id
        }
      })
        .then(res => {
          this.SatisfactionData = res.data
        })
    },

    editPersons (id) {//反填甲方负责人
      this.dialogVisibleEdit = true
      this.$http({
        url: 'CustInfo/GetPersonFT',
        method: 'get',
        params: {
          id: id
        }
      })
        .then(res => {
          this.AddPerson1 = res.data
        })
    },
    editAccessorys (row) {//反填附件
      this.dialogVisibless2 = true
      this.$http({
        url: 'CustInfo/GetAccessoryFT',
        method: 'get',
        params: {
          id: row.AcsoryId
        }
      })
        .then(res => {
          this.upAccessory = res.data

        })
    },
    editSatisfactions (row) {//查看客户满意度
      this.dialogVisibles1 = true
      this.$http({
        url: 'CustInfo/GetSatisfactionFT',
        method: 'get',
        params: {
          id: row.SaId
        }
      })
        .then(res => {
          this.UpSatisfaction = res.data
        })
    },
    //导出excel
    loadExcel () {
      if (confirm("是否确定下载")) {
        window.open("CustInfoPersonList/DownloadExcel")
      }
    },
    fh () {//返回
      this.$router.push('/CustInfoList')
    }

  },
  created () {
    this.editCustInfoEdit();
    this.showPersons();
    this.EditExtended();
    this.showAddress1();
    this.showTypes();
    this.showIndustry();
    this.showAccessorys();
    this.showSatisfactions();
  }
}
</script>
<style scoped>
